<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>入库信息</title>
	</head>
	<link rel="stylesheet" type="text/css" href="../plugins/layui/css/layui.css" />
	<script src="../plugins/layui/layui.js" type="text/javascript" charset="utf-8"></script>
	<style type="text/css">
		.layui-container,.layui-table,.layui-form{
			margin: 0px;
		}
		.layui-col-md3{
			width: 15%;
		}
	</style>
	<body>

	<div class="layui-fluid">
		  <div class="layui-row">
		    <div class="layui-col-sm3">
		      <div class="grid-demo grid-demo-bg1">
		      	<!--商品类型-->
					<div class="layui-card layui-block" style="margin-top: 15px;">
						<div class="layui-card-header layui-bg-green">选择产品类型</div>
						<div class="layui-card-body">

							<ul id="demo"></ul>

						</div>
					</div>
		      </div>
		    </div>
		    <div class="layui-col-sm9">
		      <div class="grid-demo">
		      	<table class="layui-table layui-bg-green" lay-data="{
						url:'../dataset/stock.json', 
						page:true, 
						id:'test',
						toolbar:'#headbar'
						}" lay-filter="test">
						<script type="text/html" id="headbar">
							<a href="shangpinruku.html" class="layui-btn" lay-event="add"><i class="layui-icon">&#xe654;</i></a>
						</script>
						<script type="text/html" id="col_bar">
							<button class="layui-btn layui-btn-normal layui-btn-sm" lay-event="update">修改</button>
							<button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="delete">删除</button>
						</script>
						<thead>
							<tr>
								<th lay-data="{field:'stock_id', sort: true}">库存编号</th>
								<th lay-data="{field:'goods_id', sort: true}">商品编号</th>
								<th lay-data="{field:'stock_num',  sort: true}">入库数量</th>
								<div class="layui-inline">
									<th lay-data="{field:'stock_time',edit:true,sort:true}">入库时间</th>
								</div>
								<th lay-data="{field:'stock_person'}">入库人员</th>
								<th lay-data="{field:'nomatter',width:150,toolbar:'#col_bar'}">操作</th>
							</tr>
						</thead>
					</table>
		      </div>
		    </div>
		  </div>
		</div>

	</body>
	<script type="text/javascript">
		layui.use(["table", "layer"], function() {
			var tab = layui.table;
			var lay = layui.layer;

			tab.on("edit(test)", function(obj) {
				console.log(obj.value); //得到修改后的值
				console.log(obj.field); //当前编辑的字段名
				console.log(obj.data); //所在行的所有相关数据  

			});

			tab.on("toolbar(test)", function(obj) {
				lay.msg(obj.event);

			});

			tab.on("tool(test)", function(obj) {
				if(obj.event === "update") {
					lay.msg("你单击的是修改!");
					obj.update({
						username: "修改的值"
					});
				} else if(obj.event === "delete") {
					lay.confirm('确定删除吗?', {
						icon: 3,
						title: '提示'
					}, function(index) {
						//do something
						lay.close(index);
						obj.del(); //删除当前行

					});
				}
			})
		})
	</script>
	<script type="text/javascript">
		layui.use("tree", function() {
			layui.tree({
				elem: '#demo' //传入元素选择器
					,
				nodes: [ //节点
						 {
							name: '所有类型',
							id: 2,
							spread: true,
							children: [{
								name: '电子产品',
								id: 21,
								spread: false,
								children: [{
									name: '手机',
									id: 211,
									children: [{
										name: '小米',
										id: 2111
									}, {
										name: '华为',
										id: 2112
									}, {
										name: '苹果',
										id: 2113
									}]
								}, {
									name: '电脑',
									id: 212
								}, {
									name: '平板',
									id: 213
								}]
							}, {
								name: '服饰',
								id: 22,
								children: [{
									name: '男装',
									id: 221
								}, {
									name: '女装',
									id: 222
								}, {
									name: '儿童',
									id: 223
								}]
							},{
								name: '食品',
								id: 23,
								children: [{
									name: '面包',
									id: 231
								}, {
									name: '薯条',
									id: 232
								}, {
									name: '饼干',
									id: 233
								}]
							},{
								name: '饮料',
								id: 24,
								children: [{
									name: '果汁',
									id: 241
								}, {
									name: '奶',
									id: 242
								}]
							}]
						}
					],click: function(node){
					    console.log(node) //node即为当前点击的节点数据
					  }  
				});		
		})
	</script>

</html>